<template>
    <div class="programme px-20">
        <div v-if="isOpen" class="pt-15">
            <form-view
                :list="formMember"
                :gridFormItem="4"
                :height="0"
                row
            ></form-view>
        </div>
        <div class="fr-ac-jsb pb-15" :class="isOpen ? '' : 'pt-15'">
            <div>
                <el-button
                    v-for="item in buttonList"
                    :style="blue"
                    :key="item.id"
                    @click="buttonClick(item)"
                    >{{ item.title }}</el-button
                >
            </div>
            <el-button @click="isOpen = !isOpen">
                <el-icon>
                    <Search />
                </el-icon>
            </el-button>
        </div>
        <table-view
            ref="tableViewRef"
            checkbox
            :data="tableData"
            :propList="tableProp"
            :total="tableTotal"
            @pageClick="tablePage"
            @sortClick="tableSort"
            @itemClick="tableSelection"
            :spacing="20"
            :pageSize="15"
        ></table-view>
    </div>
</template>
<script setup>
import { onMounted, ref } from "vue";
import {
    customLists,
    customLog,
    customBatchInner,
    customBatch,
    customExport,
    customLabel,
    selectList,
    accountBatch,
} from "./volunteer";
import { useUserStore } from "@/store/userStore";
import { blue, purple } from "@/comment/data";
import {
    updateMessage,
    updateOrGetValue,
    optionsArray,
    time,
    flieDownload,
    encryptAES,
    decryptAES,
} from "@/comment/method";
import { zxkm, sxkm, sex, year, getYear, tabInnerList } from "./data";
const userStore = useUserStore();
const tableData = ref([]);
const tableProp = ref([
    {
        id: 1,
        prop: "id",
        label: "ID",
    },
    {
        id: 2,
        prop: "name",
        label: "姓名",
    },
    {
        id: 3,
        prop: "phone",
        label: "手机号",
    },
    {
        id: 4,
        prop: "year",
        label: "选科",
    },
    {
        id: 5,
        prop: "year",
        label: "分数",
    },
    {
        id: 6,
        prop: "year",
        label: "年份",
    },
    {
        id: 7,
        prop: "assistant",
        label: "助理",
    },
    {
        id: 8,
        prop: "filling",
        label: "填报师",
    },
    {
        id: 9,
        prop: "check",
        label: "审核员",
    },
    {
        id: 10,
        prop: "schedule",
        label: "服务进度",
        status: [],
    },
    {
        id: 11,
        prop: "time_limit",
        label: "填报服务时限",
        sortable: "custom",
    },
    {
        id: 12,
        prop: "remark",
        label: "备注",
    },
    {
        id: 13,
        prop: "",
        label: "操作",
        operate: [],
    },
]);
const tableTotal = ref(0);
const buttonList = ref([
    {
        id: 1,
        title: "批量操作",
        roles: ["管理员"],
    },
    {
        id: 2,
        title: "批量家长导出",
        roles: ["管理员", "助理", "审核员", "填报师"],
    },
    {
        id: 3,
        title: "批量内部导出",
        roles: ["管理员", "助理", "审核员", "填报师"],
    },
]);
const tabulationCondition = ref({
    ksxx_name: "",
    phone: "",
    assistant: "",
    filling: "",
    check: "",
    schedule: "",
    time_limit: "",
    ksxx_sxkm: "",
    ksxx_zxkm: "",
    min_score: "",
    max_score: "",
    remark: "",
    label: "",
    year: getYear,
});
const scheduleSort = ref({
    sort: "",
    sort_name: "",
});
const isOpen = ref(false);
const page = ref(1);
const formMember = ref([
    {
        id: 1,
        prefix: false,
        type: "",
        label: "姓名/ID",
        model: "",
        prop: "ksxx_name",
        suffixIcon: "",
        rules: [],
        formType: "input",
        placeholder: "请输入姓名或ID",
        list: [],
    },
    {
        id: 2,
        prefix: false,
        type: "",
        label: "手机号",
        model: "",
        prop: "phone",
        suffixIcon: "",
        rules: [],
        formType: "input",
        placeholder: "请输入手机号",
        list: [],
    },
    {
        id: 3,
        prefix: false,
        type: "",
        label: "首选",
        model: "",
        prop: "ksxx_sxkm",
        suffixIcon: "CaretBottom",
        rules: [],
        formType: "select",
        placeholder: "请选择",
        list: optionsArray(sxkm, "", "", "请选择"),
    },
    {
        id: 4,
        prefix: false,
        type: "",
        label: "再选",
        model: "",
        prop: "ksxx_zxkm",
        suffixIcon: "CaretBottom",
        rules: [],
        formType: "select",
        placeholder: "请选择",
        list: optionsArray(zxkm, "", "", "请选择"),
    },
    {
        id: 5,
        prefix: false,
        type: "",
        label: "分数",
        model: "",
        prop: "score",
        suffixIcon: "",
        rules: [],
        formType: "col",
        placeholder: "请选择",
        list: [],
    },
    {
        id: 6,
        prefix: false,
        type: "",
        label: "助理",
        model: "",
        prop: "assistant",
        suffixIcon: "",
        rules: [],
        formType: "input",
        placeholder: "请输入助理昵称",
        list: [],
    },
    {
        id: 7,
        prefix: false,
        type: "",
        label: "填报师",
        model: "",
        prop: "filling",
        suffixIcon: "",
        rules: [],
        formType: "input",
        placeholder: "请输入填报师昵称",
        list: [],
    },
    {
        id: 8,
        prefix: false,
        type: "",
        label: "审核员",
        model: "",
        prop: "check",
        suffixIcon: "",
        rules: [],
        formType: "input",
        placeholder: "请输入审核员昵称",
        list: [],
    },
    {
        id: 9,
        prefix: false,
        type: "",
        label: "服务进度",
        model: "",
        prop: "schedule",
        suffixIcon: "CaretBottom",
        rules: [],
        formType: "select",
        placeholder: "请选择",
        list: [
            { label: "请选择", value: "" },
            { label: "信息", value: "information" },
            { label: "专业", value: "major" },
            { label: "提交", value: "submit" },
            { label: "填报", value: "filling" },
            { label: "生成", value: "generate" },
            { label: "审核", value: "check" },
            { label: "结单", value: "completion" },
            { label: "录取", value: "enroll" },
        ],
    },
    {
        id: 10,
        prefix: false,
        type: "",
        label: "服务时限",
        model: "",
        prop: "time_limit",
        suffixIcon: "CaretBottom",
        rules: [],
        formType: "select",
        placeholder: "请选择",
        list: [
            { value: "", label: "请选择" },
            { value: 1, label: "一天" },
            { value: 2, label: "二天" },
            { value: 3, label: "三天" },
            { value: 4, label: "三天以上" },
        ],
    },
    {
        id: 11,
        prefix: false,
        type: "",
        label: "备注",
        model: "",
        prop: "remark",
        suffixIcon: "",
        rules: [],
        formType: "input",
        placeholder: "请输入审核员昵称",
        list: [],
    },
    {
        id: 12,
        prefix: false,
        type: "",
        label: "标签",
        model: "",
        prop: "label",
        suffixIcon: "CaretBottom",
        rules: [],
        formType: "select",
        placeholder: "请选择",
        list: [],
    },
    {
        id: 13,
        prefix: false,
        type: "",
        label: "年份",
        model: getYear,
        prop: "year",
        suffixIcon: "CaretBottom",
        rules: [],
        formType: "select",
        placeholder: "请选择",
        list: optionsArray(year),
    },
    {
        id: 14,
        prefix: false,
        type: "",
        label: "",
        model: "",
        prop: "",
        suffixIcon: "",
        rules: [],
        formType: "null",
        placeholder: "",
        list: [
            {
                label: "查询",
                value: "查询",
                type: "query",
                style: blue,
                void: (val) => {
                    tabulationCondition.value = val;
                    if (val.year == 2024) {
                        const newOperate = operate.value.filter(
                            (item) => item.id == 2 || item.id == 4
                        );
                        updateOrGetValue(
                            13,
                            "operate",
                            tableProp.value,
                            newOperate
                        );
                    } else {
                        updateOrGetValue(
                            13,
                            "operate",
                            tableProp.value,
                            operate.value
                        );
                    }
                    list(val, 1, scheduleSort.value);
                },
            },
            {
                label: "重置",
                value: "重置",
                type: "reset",
                style: blue,
                void: (val) => {
                    tabulationCondition.value = val;
                    list(val, 1, scheduleSort.value);
                    updateOrGetValue(
                        13,
                        "operate",
                        tableProp.value,
                        operate.value
                    );
                },
            },
            {
                label: "导出",
                value: "导出",
                type: "",
                style: blue,
                void: (val) => {
                    exportFile("export");
                },
            },
        ],
    },
]);
const operate = ref([
    {
        id: 1,
        label: "服务",
        isPopover: false,
        tooltip: "",
        style: purple,
        void: (val) => {
            // 获取路径
            const path = getPath(val, tabInnerList, userStore);
            // 构建对象
            let obj = {
                id: val.id,
                volunteer_id: val.volunteer_id,
                name: val.name,
                path: path,
            };
            // 加密数据
            let encrypt = encryptAES(JSON.stringify(obj));
            // 生成 URL 并在新标签页打开
            let url = `${window.location.origin}${obj.path}?info=${encrypt}`;
            window.open(url, "_blank");

            // console.log(
            //     decryptAES(encryptAES(JSON.stringify(obj))),
            //     "22222222222222222"
            // );
        },
    },
    {
        id: 2,
        label: "日志",
        isPopover: false,
        tooltip: "",
        style: purple,
        void: (val) => {
            //
        },
    },
    {
        id: 3,
        label: "分配",
        isPopover: false,
        tooltip: "",
        style: "tabulation",
        void: (val) => {
            //
        },
    },
    {
        id: 4,
        label: "标签",
        isPopover: false,
        tooltip: "",
        style: purple,
        void: (val) => {
            //
        },
    },
]);
const tableViewRef = ref(null);
const tableItem = ref([]);
const list = async (condition, page, sort) => {
    let data = {
        ...condition,
        limit: 15,
        page: page,
        province: userStore.user.province,
        type: 1,
        ...sort,
    };
    const res = await customLists(data);
    let list = res.lists.map((item) => {
        return {
            ...item,
            time_limit: time(item.time_limit),
        };
    });
    let status = res.lists.map((item, ind) => {
        return {
            id: ind + 1,
            信息: item.information_status,
            专业: item.major_status,
            提交: item.submit_status,
            填报: item.filling_status,
            生成: item.generate_status,
            审核: item.check_status,
            结单: item.completion_status,
            录取: item.enroll_status,
        };
    });
    updateOrGetValue(10, "status", tableProp.value, status);
    tableData.value = list;
    tableTotal.value = res.total;
};
const tablePage = (val) => {
    page.value = val;
    list(tabulationCondition.value, page.value, scheduleSort.value);
};
const tableSort = (val) => {
    switch (val.order) {
        case "descending":
            scheduleSort.value.sort = "desc";
            scheduleSort.value.sort_name = val.prop;
            break;
        case "ascending":
            scheduleSort.value.sort = "asc";
            scheduleSort.value.sort_name = val.prop;
            break;
        case null:
            scheduleSort.value.sort = "";
            scheduleSort.value.sort_name = "";
            break;
    }
    list(tabulationCondition.value, page.value, scheduleSort.value);
};
const tableSelection = (val) => {
    tableItem.value = val;
};
const buttonClick = (val) => {
    if (tableItem.value.length == 0) return;
    switch (val.id) {
        case 1:
            break;
        case 2:
            exportFile("parent");
            break;
        case 3:
            exportFile("inner");
            break;
    }
    tableViewRef.value.clearClick();
    tableItem.value = [];
};
const exportFile = async (type) => {
    let res;
    let name;
    let file;
    switch (type) {
        case "export":
            res = await customExport({
                ...tabulationCondition.value,
                province: userStore.user.province,
                type: 1,
            });
            name = "客户列表";
            file = "xlsx";
            break;
        case "parent":
            res = await customBatch({
                custom_id: tableItem.value.map((item) => item.id).join(","),
            });
            name = "批量家长信息核对";
            file = "docx";
            break;
        case "inner":
            res = await customBatchInner({
                custom_id: tableItem.value.map((item) => item.id).join(","),
            });
            name = "批量内部信息核对";
            file = "docx";
            break;
        default:
            throw new Error("Unknown export type");
    }
    // return res;
    flieDownload(res, name, file);
};
// 获取路径的函数
const getPath = (val, tabInnerList, userStore) => {
    // 状态和对应路径的映射
    const statusPaths = {
        information_status: "/homeList",
        major_status: "/homeList/speciality",
        submit_status: "/homeList/submit",
        filling_status: "/homeList/filling",
        generate_status: "/homeList/generateView",
        check_status: "/homeList/check",
        completion_status: "/homeList/completion",
        enroll_status: "/homeList/admission",
    };
    const tab = tabInnerList.filter(
        (item) =>
            item.company.includes(userStore.user.company_id) &&
            item.roles.includes(userStore.user.crowd)
    );
    userStore.tabInnerList = tab;

    // 查找第一个状态为 0 的路径
    for (const status in statusPaths) {
        if (val[status] === 0) {
            return statusPaths[status];
        }
    }

    // 如果没有匹配的状态，返回 tab 中的最后一个路径
    return tab.length > 0 ? tab[tab.length - 1].path : tab[0].path;
};
onMounted(() => {
    list(tabulationCondition.value, 1, scheduleSort.value);
    updateOrGetValue(13, "operate", tableProp.value, operate.value);
    buttonList.value = buttonList.value.filter((item) =>
        item.roles.includes(userStore.user.crowd)
    );
});
</script>
<style lang="scss" scoped></style>
